<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <!--如果是IE 就以标准渲染-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

    <!-- 视窗——————响应式布局 -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />

    <!--当前页面的三要素-->
    <title>运维系统</title>
    <meta name="description" content="聚能优电" />
    <meta http-equiv="keywords" content="聚能优电" />
    <script type="text/javascript" src="./js/verify.js"></script>
    <script type="text/javascript" src="./js/common/commonfuntion.js"></script>
    <!-- css -->
    <link rel="stylesheet" type="text/css" href="./css/common/common.css" />
    <link rel="stylesheet" type="text/css" href="./css/jquery-accordion-menu.css" />
    <link rel="stylesheet" type="text/css" href="./css/mainmonitor_sz.css" />

</head>

<body>
    <div id="container" class="mainmonitor_sz">
        <div class="mainmonitor_sz_01">
            <!--主屏内容-->
            <div class="mainmonitor_sz_screen">
                <div class="m_title">
                    <a href="JavaScript:history.go(-1);" class="back">
                        <img src="./images/back.svg" alt="" />
                    </a>
                    <span class="tit" id="projectNameCN"></span>
                </div>

                <div class="m_content">
                    <header class="tabHead">
                        <span><i style="color:#fff;">项目状态</i></span>
                    </header>
                    <article class="khfxWarp">
                        <div class="khfxPane xmzt">
                            <div class="zt2 ztdetail firstdetail">
                                <div class="tit_tit" id="tit_tit">
                                    <img src="./images/titicon.svg" alt="" />
                                    <span>储能变流器</span>
                                </div>
                                <ul>
                                    <li>
                                        <p>U相电压</p>
                                        <div class="ztdiv">
                                            <span id="uv">0</span><span>V</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>U相电流</p>
                                        <div class="ztdiv">
                                            <span id="ua">0</span><span>A</span>
                                        </div>
                                    </li>
                                    
                                </ul>

                                <ul>
                                    <li>
                                        <p>V相电压</p>
                                        <div class="ztdiv">
                                            <span id="vv">0</span><span>V</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>V相电流</p>
                                        <div class="ztdiv">
                                            <span id="va">0</span><span>A</span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>W相电压</p>
                                        <div class="ztdiv">
                                            <span id="wv">0</span><span>V</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>W相电流</p>
                                        <div class="ztdiv">
                                            <span id="wa">0</span><span>A</span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>频率</p>
                                        <div class="ztdiv">
                                            <span id="frep">0</span><span>Hz</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>功率因数</p>
                                        <div class="ztdiv">
                                            <span id="pf">0</span><span></span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>直流侧电压</p>
                                        <div class="ztdiv">
                                            <span id="zv">0</span><span>V</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>直流侧电流</p>
                                        <div class="ztdiv">
                                            <span id="za">0</span><span>A</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>直流功率</p>
                                        <div class="ztdiv">
                                            <span id="zp">0</span><span>kW</span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>系统有功功率</p>
                                        <div class="ztdiv">
                                            <span id="ap">0</span><span>kW</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>系统无功功率</p>
                                        <div class="ztdiv">
                                            <span id="rp">0</span><span>kVar</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>系统视在功率</p>
                                        <div class="ztdiv">
                                            <span id="ae">0</span><span>kVA</span>
                                        </div>
                                    </li>
                                </ul>

                            </div>

                            <div class="zt2 ztdetail" style="margin-top: 0.3rem;">
                                <div class="tit_tit">
                                    <img src="./images/titicon.svg" alt="" />
                                    <span>空调</span>
                                </div>

                                <ul>
                                    <li>
                                        <p>室外温度</p>
                                        <div class="ztdiv">
                                            <span id="outdoorTemperature">0</span><span>℃</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>室内温度</p>
                                        <div class="ztdiv">
                                            <span id="innerTemperature">0</span><span>℃</span>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <p>盘管温度</p>
                                        <div class="ztdiv">
                                            <span id="coilTemperature">0</span><span>℃</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>冷凝温度</p>
                                        <div class="ztdiv">
                                            <span id="condensationTemperature">0</span><span>℃</span>
                                        </div>
                                    </li>
                                </ul>
                                <ul>
                                    <li>
                                        <p>排气温度</p>
                                        <div class="ztdiv">
                                            <span id="exhaustTemperature">0</span><span>℃</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>湿度</p>
                                        <div class="ztdiv">
                                            <span id="humidity">0</span><span>%RH</span>
                                        </div>
                                    </li>
                                </ul>
                                
                            </div>

                            <div class="zt2 ztdetail" style="margin-top: 0.3rem;">
                                <div class="tit_tit">
                                    <img src="./images/titicon.svg" alt="" />
                                    <span>电池</span>
                                </div>

                                <ul>
                                    <li>
                                        <p>SOC</p>
                                        <div class="ztdiv">
                                            <span id="soc">0</span><span>%</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>SOH</p>
                                        <div class="ztdiv">
                                            <span id="soh">0</span><span>%</span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>当前可放电量</p>
                                        <div class="ztdiv">
                                            <span id="rc">0</span><span>kWh</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>当前可充电量</p>
                                        <div class="ztdiv">
                                            <span id="dq">0</span><span>kWh</span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>当前最大允许放电功率</p>
                                        <div class="ztdiv">
                                            <span id="mfp">0</span><span>kW</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>当前最大允许充电功率</p>
                                        <div class="ztdiv">
                                            <span id="mcp">0</span><span>kW</span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>最高单体电压值</p>
                                        <div class="ztdiv">
                                            <span id="msv">0</span><span>V</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>最高单体电压所在编号</p>
                                        <div class="ztdiv">
                                            <span id="msvid">0</span><span></span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>次高单体电压值</p>
                                        <div class="ztdiv">
                                            <span id="cmsv">0</span><span>V</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>次高单体电压所在编号</p>
                                        <div class="ztdiv">
                                            <span id="cmsvid">0</span><span></span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>最低单体电压值</p>
                                        <div class="ztdiv">
                                            <span id="lsv">0</span><span>V</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>最低单体电压所在编号</p>
                                        <div class="ztdiv">
                                            <span id="lsvid">0</span><span></span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>次低单体电压值</p>
                                        <div class="ztdiv">
                                            <span id="clsv">0</span><span>V</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>次低单体电压所在编号</p>
                                        <div class="ztdiv">
                                            <span id="clsvid">0</span><span></span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>最高单体温度值</p>
                                        <div class="ztdiv">
                                            <span id="mst">0</span><span>℃</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>最高单体温度所在编号</p>
                                        <div class="ztdiv">
                                            <span id="mstid">0</span><span></span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>次高单体温度值</p>
                                        <div class="ztdiv">
                                            <span id="cmst">0</span><span>℃</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>次高单体温度所在编号</p>
                                        <div class="ztdiv">
                                            <span id="cmstid">0</span><span></span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>最低单体温度值</p>
                                        <div class="ztdiv">
                                            <span id="lst">0</span><span>℃</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>最低单体温度所在编号</p>
                                        <div class="ztdiv">
                                            <span id="lstid">0</span><span></span>
                                        </div>
                                    </li>
                                </ul>

                                <ul>
                                    <li>
                                        <p>次低单体温度值</p>
                                        <div class="ztdiv">
                                            <span id="clt">0</span><span>℃</span>
                                        </div>
                                    </li>
                                    <li>
                                        <p>次低单体温度所在编号</p>
                                        <div class="ztdiv">
                                            <span id="cltsid">0</span><span></span>
                                        </div>
                                    </li>
                                </ul>

                            </div>
                        </div>

                        
                    </article>
                </div>
            </div>
        </div>
    </div>

    <script>
        (function (win, doc) {
            var docEl = doc.documentElement || document.body; //获取HTML标签

            var container = doc.getElementById("container"); //container元素
            //判断是移动端设备还是PC,移动 就采用'orientationchange',横竖屏事件，PC端就采用onresize，窗口改变时间
            var resize =
                "onorientationchange" in win ? "orientationchange" : "resize";

            function rem() {
                docEl.style.fontSize = 100 * (container.clientWidth / 750) + "px";
            }

            //监听'DOMContent事件:DOM加载完成执行,如果DOMContent事件，那么执行rem函数
            doc.addEventListener("DOMContentLoaded", rem, false);

            //win下监听resize事件,如果resize事件，那么执行rem函数
            win.addEventListener(resize, rem, false);
        })(window, document);
    </script>
    <!-- js -->
    <script type="text/javascript" src="./js/jquery-3.4.1.js"></script>
    <script type="text/javascript" src="js/echarts.js"></script>
    <script type="text/javascript" src="./layer/layer.js"></script>
    <script>
        $(document).ready(function () {
            // var index = layer.load(0, {
            //     shade: [0.8, '#fff']
            // }); //0.1透明度的白色背景
            var projectid = GetQueryString('projectid');
            // var linechartid = GetQueryString('linechartid');
            var projectNameCN = GetQueryString('projectNameCN');
            $("#projectNameCN").html(' ');
            $("#projectNameCN").html(projectNameCN);

            $("#tit_tit").append(`
                <div style="position:absolute;top:2px;right:5px;font-size: 0.24rem;color: #435a7a;font-weight: bold;letter-spacing: 0.88px;" id="showtime"></div>
            `);
            var num_index = 0;
            var maxrunModel = 0;
            $.ajax({
                type: "GET",
                dataType: "json",
                url: "http://112.74.169.99:21021/api/TokenAuth/GetProjectData?projectid=" + projectid,
                beforeSend: function (xhr) {
                    xhr.setRequestHeader("Accept", "application/json, text/javascript, */*; q=0.01" );
                    xhr.setRequestHeader("Authorization", accessToken);
                    xhr.setRequestHeader('.AspNetCore.Culture', 'zh-Hans');
                },
                success: function (res) {
                    var data = res.result;

                    let time = data[0].creationTime.split('T');

                    $("#showtime").html(' ');
                    $("#showtime").html('数据更新时间 ' + time[1].substring(0,8));

                    if (data.length == 0) {
                        layer.open({
                            type: 1,
                            content: '<div>' + '通讯异常' +
                                '</div>',
                            btn: '确定',
                            btnAlign: 'c', //按钮居中
                            shade: 0, //不显示遮罩
                            yes: function () {
                                layer.closeAll();
                                // layer.close(index);
                            }
                        });
                    } else {

                        

                        // PCS
                        $("#uv").html(data[0].uv); // U相电压
                        $("#ua").html(data[0].ua); // U相电流

                        $("#vv").html(data[0].vv); // V相电压
                        $("#va").html(data[0].va); // V相电流

                        $("#wv").html(data[0].wv); // W相电压
                        $("#wa").html(data[0].wa); // W相电流

                        $("#frep").html(data[0].frep); // 频率
                        $("#pf").html(data[0].pf); // 功率因数

                        $("#zv").html(data[0].zv); // 直流侧电压
                        $("#za").html(data[0].za); // 直流侧电流
                        $("#zp").html(data[0].zp); // 直流功率

                        $("#ap").html(data[0].ap); // 系统有功功率
                        $("#rp").html(data[0].rp); // 系统无功功率
                        $("#ae").html(data[0].ae); // 系统视在功率


                        // 空调
                        $("#outdoorTemperature").html(data[0].outdoorTemperature); // 室外温度
                        $("#innerTemperature").html(data[0].innerTemperature); // 室内温度

                        $("#coilTemperature").html(data[0].coilTemperature); // 盘管温度
                        $("#condensationTemperature").html(data[0].condensationTemperature); // 冷凝温度

                        $("#exhaustTemperature").html(data[0].exhaustTemperature); // 排气温度
                        $("#humidity").html(data[0].humidity); // 湿度


                        // 电池
                        $("#soc").html(data[0].soc); // SOC
                        $("#soh").html(data[0].soh); // SOH

                        $("#rc").html(data[0].rc); // 当前可放电量
                        $("#dq").html(data[0].dq); // 当前可充电量

                        $("#mfp").html(data[0].mfp); // 当前最大允许放电功率
                        $("#mcp").html(data[0].mcp); // 当前最大允许充电功率

                        $("#msv").html(data[0].msv); // 最高单体电压值
                        $("#msvid").html(data[0].msvid); // 最高单体电压所在编号

                        $("#cmsv").html(data[0].cmsv); // 次高单体电压值
                        $("#cmsvid").html(data[0].cmsvid); // 次高单体电压所在编号

                        $("#lsv").html(data[0].lsv); // 最低单体电压值
                        $("#lsvid").html(data[0].lsvid); // 最低单体电压所在编号

                        $("#clsv").html(data[0].clsv); // 次低单体电压值
                        $("#clsvid").html(data[0].clsvid); // 次低单体电压所在编号

                        $("#mst").html(data[0].mst); // 最高单体温度值
                        $("#mstid").html(data[0].mstid); // 最高单体温度所在编号

                        $("#cmst").html(data[0].cmst); // 次高单体温度值
                        $("#cmstid").html(data[0].cmstid); // 次高单体温度所在编号

                        $("#lst").html(data[0].lst); // 最低单体温度值
                        $("#lstid").html(data[0].lstid); // 最低单体温度所在编号

                        $("#clt").html(data[0].clt); // 次低单体温度值
                        $("#cltsid").html(data[0].cltsid); // 次低单体温度所在编号

                        setInterval(updateData,1000);
                    }

                },
                error: function (err) {
                    console.log("首次请求数据 请求失败");
                }
            });

            // tab选项卡切换
            $(".tabHead span").on("click", function () {
                var $this = $(this);
                var itemIndex = $this.index();
                $(this).addClass("active").siblings(".tabHead span").removeClass("active");
                $(".khfxPane").eq(itemIndex).show().siblings(".khfxPane").hide();
            });


            function updateData() { // 请求数据
                num_index++;
                var onoff = isPositiveNum(num_index / 15); //一分钟增加一次数据

                $.ajax({
                    type: "GET",
                    dataType: "json",
                    url: "http://112.74.169.99:21021/api/TokenAuth/GetProjectData?projectid=" + projectid,
                    beforeSend: function (xhr) {
                        xhr.setRequestHeader("Accept", "application/json, text/javascript, */*; q=0.01");
                        xhr.setRequestHeader("Authorization", accessToken);
                        xhr.setRequestHeader('.AspNetCore.Culture', 'zh-Hans');
                    },
                    success: function (res) {
                        var data = res.result;

                        let time = data[0].creationTime.split('T');

                        $("#showtime").html(' ');
                        $("#showtime").html('数据更新时间 ' + time[1].substring(0,8));

                        // PCS
                        $("#uv").html(data[0].uv); // U相电压
                        $("#ua").html(data[0].ua); // U相电流

                        $("#vv").html(data[0].vv); // V相电压
                        $("#va").html(data[0].va); // V相电流

                        $("#wv").html(data[0].wv); // W相电压
                        $("#wa").html(data[0].wa); // W相电流

                        $("#frep").html(data[0].frep); // 频率
                        $("#pf").html(data[0].pf); // 功率因数

                        $("#zv").html(data[0].zv); // 直流侧电压
                        $("#za").html(data[0].za); // 直流侧电流
                        $("#zp").html(data[0].zp); // 直流功率

                        $("#ap").html(data[0].ap); // 系统有功功率
                        $("#rp").html(data[0].rp); // 系统无功功率
                        $("#ae").html(data[0].ae); // 系统视在功率


                        // 空调
                        $("#outdoorTemperature").html(data[0].outdoorTemperature); // 室外温度
                        $("#innerTemperature").html(data[0].innerTemperature); // 室内温度

                        $("#coilTemperature").html(data[0].coilTemperature); // 盘管温度
                        $("#condensationTemperature").html(data[0].condensationTemperature); // 冷凝温度

                        $("#exhaustTemperature").html(data[0].exhaustTemperature); // 排气温度
                        $("#humidity").html(data[0].humidity); // 湿度


                        // 电池
                        $("#soc").html(data[0].soc); // SOC
                        $("#soh").html(data[0].soh); // SOH

                        $("#rc").html(data[0].rc); // 当前可放电量
                        $("#dq").html(data[0].dq); // 当前可充电量

                        $("#mfp").html(data[0].mfp); // 当前最大允许放电功率
                        $("#mcp").html(data[0].mcp); // 当前最大允许充电功率

                        $("#msv").html(data[0].msv); // 最高单体电压值
                        $("#msvid").html(data[0].msvid); // 最高单体电压所在编号

                        $("#cmsv").html(data[0].cmsv); // 次高单体电压值
                        $("#cmsvid").html(data[0].cmsvid); // 次高单体电压所在编号

                        $("#lsv").html(data[0].lsv); // 最低单体电压值
                        $("#lsvid").html(data[0].lsvid); // 最低单体电压所在编号

                        $("#clsv").html(data[0].clsv); // 次低单体电压值
                        $("#clsvid").html(data[0].clsvid); // 次低单体电压所在编号

                        $("#mst").html(data[0].mst); // 最高单体温度值
                        $("#mstid").html(data[0].mstid); // 最高单体温度所在编号

                        $("#cmst").html(data[0].cmst); // 次高单体温度值
                        $("#cmstid").html(data[0].cmstid); // 次高单体温度所在编号

                        $("#lst").html(data[0].lst); // 最低单体温度值
                        $("#lstid").html(data[0].lstid); // 最低单体温度所在编号

                        $("#clt").html(data[0].clt); // 次低单体温度值
                        $("#cltsid").html(data[0].cltsid); // 次低单体温度所在编号

                    },
                    error: function (err) {
                        console.log("数据请求失败");
                    }
                });
            }

            // 判断是否为数字
            function isNumber(val) {
                if (val == "" || isNaN(val)) {
                    return false;
                } else {
                    return true;
                }
            }

            function numToText(obj){
                if(obj == 0){
                    obj = 无效;
                }else if(obj == 1){
                    obj = 有效;
                }
                return obj;
            }
            
            
            setTimeout(function(){
                console.log(maxrunModel);
            },3000);
            
            var abc = 100;
            // 设置页面的js
            $(".setting button").click(function(){
                var _this = this;
                var model = $(_this).attr('model');

                var value = $(_this).prev().val();
                var tit = $(_this).prev().prev().prev().find('.littit').text();

                var valuename = $(_this).attr('valuename');
                var valueitem = $(_this).attr('valueitem');
                var value_style = isNumber(value);

                if(value == ''){
                    layer.msg('请输入修改值', {
                        time: 1000 //1秒关闭（如果不配置，默认是3秒）
                    });
                }else{
                    if(!value_style){
                        layer.msg('请输入数字', {
                            time: 1000 //1秒关闭（如果不配置，默认是3秒）
                        },function(){
                            $(_this).prev().val(' ').focus();
                        });
                    }else{
                        if(model == "model"){
                            if(value == '0'){
                                layer.msg('请选择修改模式', {
                                    time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                });
                            }else {
                                layer.prompt({
                                    title: '输入密码-' + tit,
                                    formType: 1,
                                    yes:function(index, layero){
                                        var pass = layero.find(".layui-layer-input").val();
                                        if(pass == "nyy@nyy@2019"){
                                            layer.close(index);
                                            $.ajax({
                                                type: "GET",
                                                url:
                                                "http://112.74.169.99:21021/api/TokenAuth/SetDeviceValue?value=" + value + "&valuename=" + valuename + "&valueitem=" + valueitem,
                                                success: function (res) {
                                                    layer.msg('设置成功', {
                                                        time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                                    });
                                                    $(_this).prev().val('');
                                                },
                                                error: function (err) {
                                                    console.log(err);
                                                    layer.msg('设置失败', {
                                                        time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                                    });
                                                }
                                            })
                                        }else{
                                            layer.msg('请输入正确密码', {
                                                time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                            });
                                        }
                                    }
                                });

                            }
                            
                        }else if(model != "model"){
                            if(value > maxrunModel){
                                layer.msg('请输入范围内的值', {
                                    time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                },function(){
                                    $(_this).prev().val(' ').focus();
                                });
                            }else if(value < 10){
                                layer.msg('请输入范围内的值', {
                                    time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                },function(){
                                    $(_this).prev().val(' ').focus();
                                });
                            }else{
                                layer.prompt({
                                    title: '输入密码-' + tit,
                                    formType: 1,
                                    yes:function(index, layero){
                                        var pass = layero.find(".layui-layer-input").val();
                                        if(pass == "nyy@nyy@2019"){
                                            layer.close(index);
                                            $.ajax({
                                                type: "GET",
                                                url:
                                                "http://112.74.169.99:21021/api/TokenAuth/SetDeviceValue?value=" + value + "&valuename=" + valuename + "&valueitem=" + valueitem,
                                                success: function (res) {
                                                    layer.msg('设置成功', {
                                                        time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                                    });
                                                    $(_this).prev().val('');
                                                },
                                                error: function (err) {
                                                    console.log(err);
                                                    layer.msg('设置失败', {
                                                        time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                                    });
                                                }
                                            })
                                        }else{
                                            layer.msg('请输入正确密码', {
                                                time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                            });
                                        }
                                    }
                                });
                            }
                        }
                    }
                }
            });
        });
    </script>
</body>

</html>